import React, { Component } from "react";
import { withRouter } from "next/router";
import Head from "next/head";
import Header from "../../components/header/index";
import Footer from "../../components/footer/index";
import BlogDetail from "../../components/blog-detail";
import "./index.scss";


@withRouter
class Blog extends Component {

	static getInitialProps = async (ctx, store) => {
		const id = ctx.req.params.blogId;
		const acticle = await store.blogStore.getBlog(id);
		return { acticle, blogs: store.blogStore.blogs };
	}

	constructor(props) {
		super(props);
	}

	render() {
		const { acticle, blogStore } = this.props;
		return (
			<React.Fragment>
				<Head>
					<title>{acticle.title}</title>
					<meta name="keywords" content={acticle.tags ? acticle.tags.join(",") : "justdodo 博客 | 房市"} />
					<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/agate.min.css"></link>
					{/* <meta name="description" content={blogDescription} /> */}
				</Head>
				<div className="main">
					<Header blogStore={blogStore}></Header>
					<div className="main-content">
						<BlogDetail article={acticle} />
					</div>
					<Footer></Footer>
				</div>
			</React.Fragment>
		);
	}
}

export default Blog;